<script setup>
	import {
		ref
	} from "vue"

	const props = defineProps({
		isAgree: {
			type: Boolean,
			default: false
		}
	})

	let isCode = ref(false)
	let user = ref({
		tel: '',
		password: '',
		telCode: ''
	})

	const uToastRef = ref(null)
	const onLgoin = () => {
		uni.login({
			provider: 'weixin', //使用微信登录
			success:(loginRes)=> {
				console.log(loginRes);
				uni.showModal({
					title:'code',
					content:loginRes.code,
					showCancel:false,
					confirmText:'复制',
					success: (res) => {
						if(res.confirm){
							// uni.onCopyUrl()
							uni.setClipboardData({
								data: loginRes.code,
								success: function () {
									console.log('success');
								}
							});
						}
					}
				})
			}
		})
		
		return
		if (!props.isAgree) {
			return uToastRef.value.show({
				type: 'error',
				icon: false,
				message: "请先阅读并同意相关协议",
			})
		}
	}
</script>

<template>
	<view>
		<up-form>
			<up-form-item>
				<up-input type="number" color="#ffffff" v-model="user.tel" placeholder="请输入手机号"></up-input>
				<text class="y-f-s-20 $u-tips-color u-m-t-10">未注册的手机号验证登录后自动创建账号</text>
			</up-form-item>

			<up-form-item v-if="isCode">
				<up-input type="number" v-model="user.tel" placeholder="请输入验证码">
					<template #suffix>
						<up-button type="primary" size="small" text="获取验证码"></up-button>
					</template>
				</up-input>
			</up-form-item>

			<up-form-item>
				<up-input type="number" color="#ffffff" v-model="user.password" placeholder="请输入密码"></up-input>
			</up-form-item>

			<up-form-item>
				<up-button type="primary" color="#ffffff" text="立即登录" @click="onLgoin"></up-button>
			</up-form-item>
		</up-form>

		<view class="u-flex u-flex-items-center u-flex-between y-f-s-30 $u-tips-color">
			<text @click.stop="isCode = !isCode">{{isCode?'返回登录':'注册账号/忘记密码'}}</text>
			<text>遇到问题</text>
		</view>

		<up-toast ref="uToastRef" position="top"></up-toast>
	</view>
</template>



<style lang="scss" scoped>
	.tip-box {
		position: absolute;
		bottom: 60rpx;
		left: 40rpx;
		right: 40rpx;

		.agree {
			color: $uni-color-warning;
		}
	}
</style>